<template>

  <!-- 头部-->
  <div id="nav">
    <el-menu :default-active="activeIndex2" class="el-menu-demo" mode="horizontal" @select="handleSelect"
      background-color="#C80000" text-color="#fff" active-text-color="#fff">
      <el-menu-item class="hode-itme" id="dy">
        <img src="../../../images/2020-04-26_083953.png" style="width: 100px;height: 40px;" />
      </el-menu-item>
      <el-menu-item index="1" class="main-menu" id="ss"><a href="">首页</a></el-menu-item>
      <el-submenu index="2" class="main-sub">
        <template slot="title" class="main-menu"><a href="">新房</a></template>
        <el-menu-item index="2-1" class="main-menu"><a href="">本月开盘</a></el-menu-item>
        <el-menu-item index="2-2" class="main-menu"><a href="">热门楼盘</a></el-menu-item>
        <el-menu-item index="2-3" class="main-menu"><a href="">本月交房</a></el-menu-item>
        <el-menu-item index="2-4" class="main-menu"><a href="">楼盘新动态</a></el-menu-item>
        <el-menu-item index="2-5" class="main-menu"><a href="">直播看房</a></el-menu-item>
        <el-menu-item index="2-6" class="main-menu"><a href="">楼盘导购</a></el-menu-item>
        <el-menu-item index="2-7" class="main-menu"><a href="">新房排行</a></el-menu-item>
        <el-menu-item index="2-8" class="main-menu"><a href="">购房知识</a></el-menu-item>
        <el-menu-item index="2-9" class="main-menu"><a href="">看房盘</a></el-menu-item>
      </el-submenu>

      <el-submenu index="3" class="main-sub">
        <template slot="title"><a @click="goHouseTwo()" class="main-menu">二手房</a></template>
        <el-menu-item index="3-1" class="main-menu"><a href="">在售房源</a></el-menu-item>
        <el-menu-item index="3-2" class="main-menu"><a href="">优选房源</a></el-menu-item>
        <el-menu-item index="3-3" class="main-menu"><a href="">找小区</a></el-menu-item>
        <el-menu-item index="3-4" class="main-menu"><a href="">找别墅</a></el-menu-item>
        <el-menu-item index="3-5" class="main-menu"><a href="">查成交</a></el-menu-item>
        <el-menu-item index="3-6" class="main-menu"><a href="">二手房排行</a></el-menu-item>
        <el-menu-item index="3-7" class="main-menu"><a href="">购房知识</a></el-menu-item>
        <el-menu-item index="3-8" class="main-menu"><a href="">我要买房</a></el-menu-item>
      </el-submenu>
      <el-submenu index="4" class="main-sub">
        <template slot="title"><a href="" class="main-menu">租房</a></template>
        <el-menu-item index="4-1" class="main-menu"><a href="">在租房源</a></el-menu-item>
        <el-menu-item index="4-2" class="main-menu"><a href="">品牌公寓</a></el-menu-item>
        <el-menu-item index="4-3" class="main-menu"><a href="">个人房源</a></el-menu-item>
        <el-menu-item index="4-1" class="main-menu"><a href="">整租房源</a></el-menu-item>
        <el-menu-item index="4-2" class="main-menu"><a href="">合租房源</a></el-menu-item>
        <el-menu-item index="4-3" class="main-menu"><a href="">别墅房源</a></el-menu-item>
        <el-menu-item index="4-1" class="main-menu"><a href="">租房知识</a></el-menu-item>
      </el-submenu>
      <el-menu-item index="5" class="main-menu" id="ss"><a href="">查房价</a></el-menu-item>
      <el-submenu index="6" class="main-sub">
        <template slot="title"><a href="" class="main-menu">家居装修</a></template>
        <el-menu-item index="6-1" class="main-menu"><a href="">家装案例</a></el-menu-item>
        <el-menu-item index="6-2" class="main-menu"><a href="">找装修公司</a></el-menu-item>
        <el-menu-item index="6-3" class="main-menu"><a href="">装修日记</a></el-menu-item>
        <el-menu-item index="6-4" class="main-menu"><a href="">装修效果图</a></el-menu-item>
        <el-menu-item index="6-5" class="main-menu"><a href="">装修攻略</a></el-menu-item>
        <el-menu-item index="6-6" class="main-menu"><a href="">家居圈</a></el-menu-item>
        <el-menu-item index="6-7" class="main-menu"><a href="">家居资讯</a></el-menu-item>
        <el-menu-item index="6-8" class="main-menu"><a href="">建材家居</a></el-menu-item>
        <el-menu-item index="6-9" class="main-menu"><a href="">建材店铺</a></el-menu-item>
      </el-submenu>
      <el-submenu index="7" class="main-sub">
        <template slot="title"><a href="" class="main-menu">写字楼</a></template>
        <el-menu-item index="7-1" class="main-menu"><a href="">写字楼出租</a></el-menu-item>
        <el-menu-item index="7-2" class="main-menu"><a href="">写字楼出售</a></el-menu-item>
        <el-menu-item index="7-3" class="main-menu"><a href="">写字楼新盘</a></el-menu-item>
      </el-submenu>
      <el-submenu index="8" class="main-sub">
        <template slot="title"><a href="" class="main-menu">商铺</a></template>
        <el-menu-item index="8-1" class="main-menu"><a href="">商铺出租</a></el-menu-item>
        <el-menu-item index="8-2" class="main-menu"><a href="">商铺出售</a></el-menu-item>
        <el-menu-item index="8-3" class="main-menu"><a href="">商铺新盘</a></el-menu-item>
      </el-submenu>
      <el-submenu index="9" class="main-sub">
        <template slot="title"><a href="" class="main-menu">业主论坛</a></template>
        <el-menu-item index="9-1" class="main-menu"><a href="">精华贴</a></el-menu-item>
        <el-menu-item index="9-2" class="main-menu"><a href="">业主活动</a></el-menu-item>
        <el-menu-item index="9-3" class="main-menu"><a href="">装修论坛</a></el-menu-item>
        <el-menu-item index="9-4" class="main-menu"><a href="">购房圈</a></el-menu-item>
      </el-submenu>
      <el-submenu index="10" class="main-sub">
        <template slot="title"><a href="" class="main-menu">房产百科</a></template>
        <el-menu-item index="10-1" class="main-menu"><a href="">房产快讯</a></el-menu-item>
        <el-menu-item index="10-2" class="main-menu"><a href="">房产问答</a></el-menu-item>
        <el-menu-item index="10-3" class="main-menu"><a href="">房产知识</a></el-menu-item>
        <el-menu-item index="10-4" class="main-menu"><a href="">房产圈</a></el-menu-item>
      </el-submenu>
      <el-submenu index="11" class="main-sub">
        <template slot="title"><a href="" class="main-menu">更多</a></template>
        <el-menu-item index="11-1" class="main-menu"><a href="">产业</a></el-menu-item>
        <el-menu-item index="11-2" class="main-menu"><a href="">海外房产</a></el-menu-item>
        <el-menu-item index="11-3" class="main-menu"><a href="">VIP全景房</a></el-menu-item>
        <el-menu-item index="11-4" class="main-menu"><a href="">加盟房天下</a></el-menu-item>
        <el-menu-item index="11-5" class="main-menu"><a href="">移动app</a></el-menu-item>
      </el-submenu>
      <el-submenu index="12" style="margin-left: 30px;" class="main-sub">
        <template slot="title"><a class="main-menu">
            <router-link to="/Logins">登录</router-link>
          </a></template>
        <el-menu-item index="12-1" class="main-menu">
          <a href="">立即注册</a>
        </el-menu-item>
        <el-menu-item index="12-2" class="main-menu"><a href="">我的房天下</a></el-menu-item>
        <el-menu-item index="12-3" class="main-menu"><a href="">直播看房</a></el-menu-item>
        <el-menu-item index="12-4" class="main-menu"><a href="">入住房产圈</a></el-menu-item>
      </el-submenu>

      <el-menu-item index="13" class="main-menu"><a href="">经济云</a></el-menu-item>
      <el-menu-item index="14" class="main-menu"><a href="">开发云</a></el-menu-item>
      <el-submenu index="15" class="main-sub">
        <template slot="title"><a href="" class="main-menu">更多服务</a></template>
        <el-menu-item index="15-1" class="main-menu"><a href="">家居云</a></el-menu-item>
        <el-menu-item index="15-2" class="main-menu"><a href="">商办云</a></el-menu-item>
      </el-submenu>
    </el-menu>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        activeIndex2: '1'
      };
    },
    methods: {
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },
	  //  二手房主页
		  goHouseTwo(){
			this.$router.push('/houseTwo')
		  }
    }
  }
</script>

<style scoped="scoped">
  #nav {
    width: 100%;
    text-align: center;
  }

  #ss {
    margin-right: 10px;
  }

  #dy {
    margin-left: 2%;
  }

  #shou {
    background-color: #000000;
  }

  .main-menu {
    font-size: 12px;
  }

  .hode-text1 {
    display: initial;
  }

  .hode-itme {
    display: initial;
    margin-left: 50px;
  }

  .main-sub {
    margin-left: -10px;
    /* padding-left: -50px;
    padding-right: -50px; */
  }

  .hode-itme {
    background-color: #C80000 !important;
  }

  a {
    color: white;
    size: 8px;
    text-decoration: none;
  }
</style>
